<script setup lang="ts">
import * as ElementPlusIcons from '@element-plus/icons-vue'

const props = defineProps({
  iconName: {
    type: String,
    default: ''
  }
})

const iconList = ref<string[]>([]);

function getIconList() {
  iconList.value = Object.keys(ElementPlusIcons);
}

const isElIcon = computed(() => iconList.value.includes(props.iconName));

getIconList();
</script>

<template>
  <el-icon>
    <component :is="iconName" v-if="isElIcon" />
    <svg v-else class="svg-icon" aria-hidden="true">
      <use :xlink:href="'#icon-'+iconName" fill />
    </svg>
  </el-icon>
</template>

<style scoped lang="scss">
</style>
